<template>
  <div id="adminLayout">
    <a-layout>
      <a-layout-sider width="200" class="sider">
        <div class="logo">算法分析平台后台管理</div>

        >
        <a-menu theme="dark" mode="inline">
          <a-menu-item key="0" icon="file" defaultSelectedKeys="['0']"
            >首页</a-menu-item
          >
          <a-menu-item key="1" icon="user" @click="goToPage('/admin/index')"
            >Api用量查询</a-menu-item
          >
          <a-menu-item
            key="2"
            icon="team"
            @click="goToPage('/admin/userManage')"
            >用户管理</a-menu-item
          >
          <a-sub-menu key="3" title="题目管理">
            <a-menu-item key="3-1" @click="goToPage('/admin/addQuestion')"
              >录入题目</a-menu-item
            >
            <a-menu-item key="3-2" @click="goToPage('/admin/question')"
              >管理题目</a-menu-item
            >
          </a-sub-menu>
          <a-menu-item key="4" icon="file">标签管理</a-menu-item>
          <a-menu-item
            key="5"
            icon="file"
            @click="goToPage('/admin/messageManage')"
            >消息管理</a-menu-item
          >
        </a-menu>
      </a-layout-sider>
      <a-layout>
        <a-layout-header class="header">
          <div class="head-admin">
            <AdminHeader class="head-admin-in" />
          </div>
        </a-layout-header>
        <router-view />
      </a-layout>
    </a-layout>
  </div>
</template>

<style scoped>
.head-admin {
  height: 60px;
}
.head-admin-in {
  float: right;
  margin-top: 14px;
}
#adminLayout {
  background: #f0f2f5;
  max-height: 100vh;
}
#adminLayout .logo {
  height: 32px;
  margin: 16px;
  color: #fdeaea;
  font-size: 20px;
  text-align: center;
}
#adminLayout .sider {
  background: #001529;
}
#adminLayout .header {
  background: #fff;
  padding: 0;
  text-align: center;
}

#adminLayout .footer {
  text-align: center;
}
</style>

<script setup lang="ts">
// 这里可以添加后台管理相关的逻辑代码
import AdminHeader from "@/components/admin/AdminHeader.vue";
import { useRouter } from "vue-router";
import { onMounted } from "vue";

const router = useRouter();
const goToPage = (s: string) => {
  router.push(s);
};
onMounted(() => {
  router.push("/admin/index");
});
</script>
